<template>
  <div class="form-group FormTreeSelect" >
    <label :class="labelClass" :style="finalLabelStype"><span v-if="required" class="required ">*</span>{{ title }}：</label>
    <div :class="rightClass" :style="rightStyle">
      <form-pop :content="error"/>
      <a-tree-select style="width:100%;"
          v-bind="$props"
          @change="onChange" 
      >
      </a-tree-select>
    </div>
  </div>
</template>

<script>
import { TreeSelect } from 'ant-design-vue';
import simpleAttr from "@/mixins/form/simple-attr";

const defaultLabelStype =
  "font-weight: normal;justify-content: flex-end;padding-left: 5px;text-align: right;width:110px;";
export default {
    name: "FormTreeSelect",
    mixins: [simpleAttr],
    props: {
        ...TreeSelect.props,
    },
    created(){
       console.log("TreeSelect_props",TreeSelect)
    },
    computed: {
        finalLabelStype: function() {
        return this.labelStyle || defaultLabelStype;
        },
    },
    methods: {
        onChange(value) {
            console.log("FormTreeSelect",value);
        this.$emit("input", value);
        }
    }
};
</script>
<style lang="less">
// .FormInputNumber{
//     .ant-input-number{
//         width: auto !important;
//     }
// }
</style>
